import React from 'react'
import { RadioGroup } from '../ui-components/radio'
import style from './style'
import styleRadio from './style.radio'
import Code from './Code'

export default class extends React.Component {

  state = {
    data: [
      {
        label: '选项1',
        value: 0,
      },
      {
       label: '选项2',
       checked: true,
       value: 1
      }
    ]
  }

  handleChange(value) {
    this.setState({
      data: this.state.data.map(item => {
        if (item.value == value) {
          item.checked = true
        } else {
          item.checked = false
        }
        return item
      })
    })
  }

  render() {
    return (
      <div className={style.root}>
        <Code>{'<RadioGroup data={...} onChange={..} name={..}/>'}</Code>
        <div>
          <RadioGroup 
            className={styleRadio.root}
            onChange={::this.handleChange}
            name="aa" 
            data={this.state.data}
          />
        </div>
      </div>
    )
  }
}
